<!-- list.html文件 -->
<#include "./scripts_purPlan.html">

<style>
	.oper-search {
		margin: 5px 10px;
	}

	.iconBtn {
		cursor: pointer;
		transition: all 0.6s;
	}

	.iconBtn:hover {
		transform: scale(1.4);
	}

	.badge {
		display: inline-block;
		min-width: 10px;
		padding: 3px 7px;
		font-size: 12px;
		font-weight: 700;
		line-height: 1;
		color: #fff;
		text-align: center;
		white-space: nowrap;
		vertical-align: middle;
		background-color: #777;
		border-radius: 10px;
	}

	.bg-green {
		background-color: #00a65a;
	}

	.bg-red {
		background-color: rgb(221, 90, 67);
	}
</style>


<div style="background-color: #EEF1F6;">
	<div class="oper-search">
		<form class="form-inline" style="position: relative;">

			<div class="form-group">
				<label>计划单号</label>
				<input id="planNo" name="planNo" type="text" class="form-control search-cache width-180">
			</div>

			<div class="form-group">
				<label>创建日期</label>
				<input id="createTimeStart" name="createTimeStart" type="text" class="form-control search-cache width-180" autocomplete="off">
				<span>~</span>
				<input id="createTimeEnd" name="createTimeEnd" type="text" class="form-control search-cache width-180" autocomplete="off">
			</div>

			<div class="form-group">
				<label>审批状态</label>
				<select id="status" class="form-control search-cache width-180" name="status">
					<option value="">未选择</option>
					<option value="0">进行中</option>
					<option value="1">已结束</option>
				</select>
			</div>
			
            <#-- 按钮区域 -->
			<div class="form-group">
				<span class="btn btn-sm glyphicon glyphicon-search" onclick="searchPurPlan()">搜索</span>
				<span class="btn btn-sm glyphicon glyphicon-plus" onclick="addPurPlan(this);return false;">新增</span>
				<span class="btn btn-sm glyphicon glyphicon-trash btn-del">删除</span>
				<span class="btn btn-sm glyphicon glyphicon-import" onclick="importExcel()">导入</span>
				<span class="btn btn-sm glyphicon glyphicon-export" onclick="exportPurPlan()">导出</span>
			</div>
		</form>
	</div>
	
	<div class="data-list" style="margin:5px 10px; margin-bottom: 70px; background-color: white;">
		<table id="mainTable" class="dtable">
			<thead>
			<tr>
				<th style="">
					<div class="pretty success" style="margin: 0;">
						<input type="checkbox" class="check-all" id="checkAllBtn">
						<label><i class="mdi mdi-check"></i></label>
					</div>
				</th>
				
				<th style="">序号</th>
				<th style="">计划单号</th>
				<th style="">标题</th>
				<th style="">采购类型</th>
				<th style="">计划采购数量</th>
				<th style="">计划金额</th>
				<th style="">创建日期</th>
				<th style="">创建人</th>
				<th style="">详情</th>
				<th style="">当前节点</th>
				<th style="">审批状态</th>
				<th style="">审批结束时间</th>
				<th style="">操作</th>
			</tr>
			</thead>
			<tbody>
			</tbody>
		</table>
	</div>
</div>

<!-- 导出窗口 -->
<iframe class="exportIframe" style="border: none; width: 0; height: 0"></iframe>

<script>
	
	layui.use('laydate', function () {
		var laydate = layui.laydate;
		//执行一个laydate实例
		laydate.render({
			elem: '#createTimeStart', //指定元素
			type: 'datetime'
		});
		laydate.render({
			elem: '#createTimeEnd', //指定元素
			type: 'datetime'
		});
	});
	
	function getSearchPara() {
		let planNo=$("#planNo").val().trim();
		let createTimeStart=$("#createTimeStart").val().trim();
		let createTimeEnd=$("#createTimeEnd").val().trim();
		let status=$("#status").val().trim();
		let param="planNo="+planNo+"&createTimeStart="+createTimeStart+"&createTimeEnd="+createTimeEnd+"&status="+status;
		return param;
	}
	
	function getSearchUrl() {
		var url = '/purPlan/getPurPlanByPage?' + getSearchPara();
		url = encodeURI(url);
		return url;
	}
	
	function getOperHtml(purPlanId) {
		var html = '';
		//html += '<a class="btn btn-brown btn-xs"  onclick="detail(' + id + ')"><span class="glyphicon glyphicon-list-alt"></span>详情</a>&nbsp;';
		//html += '<a onclick="edit(this,\'' + purPlanId + '\');return false;" title="编辑"><i class="fa fa-pencil iconBtn" style="color: rgb(105, 170, 70);"></i></a>&nbsp;&nbsp;&nbsp;';
		//html += '<a onclick="changeStatus(this,\'' + purPlanId + '\');return false;" title="停用"><i class="glyphicon glyphicon-ban-circle iconBtn" style="color: rgb(221, 90, 67)"></i></a>&nbsp;&nbsp;&nbsp;';
		//html += '<a onclick="confirmDel(\'' + purPlanId + '\');return false;" title="删除"><i class="fa fa-trash-o iconBtn" style="color: rgb(221, 90, 67)"></i></a>&nbsp;&nbsp;&nbsp;';
		
		html += '<span class="btn btn-xs glyphicon glyphicon-pencil" onclick="edit(this,\''+purPlanId+'\');return false;">修改</span>&nbsp;';
		html += '<span class="btn btn-xs glyphicon glyphicon-trash" onclick="confirmDel(\''+purPlanId+'\');return false;" >删除</span>&nbsp;';
		return html;
	}
	
	function edit(obj, purPlanId) {
		var $this = $(obj);
		var url = "/purPlan/edit?purPlanId=" + purPlanId;
		js.addTabPage($this, '修改采购计划', url, true, true);
	}
	
	function confirmDel(purPlanId) {
		sys.confirm("确定删除该数据吗？", delPurPlan);
		function delPurPlan() {
			$.ajax({
				url : "delPurPlanById",
				type : "POST",
				datatype : "json",
				data : {
					"purPlanId" : purPlanId,
				},
				success : function(data, stats) {
					if (data.success) {
						js.showMessage("删除成功!",null,"success",1500);
						dataTable.dataTable().api().draw();
					} else {
						js.showMessage(data.message,null,"error",1500)
					}
				},
				error : function(data) {
					js.showMessage("删除失败",null,"error",1500)
				}
			});
		}
	}
	
	//注意：选项卡 依赖 element 模块，否则无法进行功能性操作
	var dataTable = $("#mainTable");
	
	$(function () {
		var noticetimeTypeMap = {0: "年", 1: "月", 2: "天", 3: "小时"};
		sys.useSimpleRetrieveData();
		var staticPrefix = "${static}";
		var config = sys.DynamicDatabeConfig(staticPrefix, getSearchUrl(), [
			
			{
				data: null,
				render: function (data) {
					var html = '<div class="pretty success" style="margin: 0;">' +
						'<input type="checkbox" data-id="' + data.id + '"> ' +
						'<label><i class="mdi mdi-check"></i></label>' +
						'</div>';
					return html;
				}
			},
			
			{data: "id"},
			{data: 'planNo'},
			{data: 'title'},
			{data: "purType"},
			{data: "planPurNum"},
			{data: "planAmount"},
			{data: "createTime"},
			{data: "createUser"},
			{data: "des"},
			{data: "currentNode"},
			{
				data: "status", render: function (row, type, data, meta) {
					if (data.status == 0) {
						return "<span class='btn-block block-normal'>" + '进行中' + "</span>";
					}
					if(data.status==1){
						return "<span class='btn-block bg-red'>" + '已结束' + "</span>";
					}
					return data.status;
				}
			},
			{data: "flowEndTime"},
			{
				data: null, render: function (data) {
					return getOperHtml(data.id);
				}
			}
		
		], true, {ordering: true});
		
		//禁止排序
		config.bSort = false;
		config.aLengthMenu = [15, 25, 50, 100];
		dataTable.dataTable(config);//.api().draw();
		
		



	});
	
	function searchPurPlan(){
		//dataTable.dataTable().api().ajax.reload(null, false);
		dataTable.DataTable().ajax.url(getSearchUrl()).load(null, false);
	}
	
	/**
	 * 新增purPlan。
	 */
	function addPurPlan(obj) {
		var $this = $(obj);
		var url = "/purPlan/add";
		js.addTabPage($this,'新增采购计划',url,true,true);
	}
	
	
	
	
	/*全选*/
	$("#mainTable").on("click", "[type='checkbox']", function (e) {
		e.stopPropagation();
		var jqCheck = $(this);
		if (jqCheck.hasClass("check-all")) {
			$(document.body).find("[type='checkbox']:not(.check-all)").each(function () {
				this.checked = jqCheck[0].checked;
			})
		} else {
			var allChecked = true;
			$(document.body).find("[type='checkbox']:not(.check-all)").each(function () {
				if (!this.checked) {
					allChecked = false;
				}
			});
			$(document.body).find(".check-all")[0].checked = allChecked;
		}
	});
	
	/*多条删除*/
	$(document.body).find(".btn-del").on("click", function () {
		var chks = $(document.body).find("[type='checkbox']:not(.check-all):checked");
		
		if (chks && chks.length) {
			var ids = "";
			for (var i = 0; i < chks.length; i++) {
				if (ids.length > 0) {
					ids += ",";
				}
				ids += chks.eq(i).data("id");
			}
			confirmDelBatch(ids);
		} else {
			//sys.topmsg("请勾选要删除的数据");
			js.showMessage("请勾选要删除的数据！", null, "warning", 1500);
		}
	});
	
	/**
	 * 确认批量删除。
	 */
	function confirmDelBatch(purPlanIds) {
		sys.confirm("确定删除选中数据吗？", delPurPlanBatch);
		function delPurPlanBatch() {
			$.ajax({
				url: "delPurPlanBatch",
				type: "POST",
				datatype: "json",
				data: {
					"purPlanIds": purPlanIds,
				},
				success: function (data, stats) {
					//console.log("delPurPlanBatch().success.data", data);
					
					if (data.success) {
						$(".check-all").attr("checked", false);
						js.showMessage("删除成功!", null, "success", 1500);
						
						dataTable.dataTable().api().ajax.reload(null, false);
						//dataTable.DataTable().ajax.url(getSearchUrl()).load(null, false);
					} else {
						js.showMessage(data.message, null, "error", 1500)
					}
				},
				error: function (data) {
					js.showMessage("删除失败", null, "error", 1500)
				}
			});
		}
	}
	
	/**
	 * 导出采购计划。
	 */
	function exportPurPlan() {
		sys.confirm("确定导出采购计划吗？", function() {
			$(".exportIframe").attr("src","/purPlan/exportExecl?" + getSearchPara());
		});
	}
	
	
	
	
	
	/**************************************时间格式化处理************************************/

	function dateFtt(fmt, date) { //author: meizz
		var o = {
			"M+": date.getMonth() + 1,     //月份
			"d+": date.getDate(),     //日
			"h+": date.getHours(),     //小时
			"m+": date.getMinutes(),     //分
			"s+": date.getSeconds(),     //秒
			"q+": Math.floor((date.getMonth() + 3) / 3), //季度
			"S": date.getMilliseconds()    //毫秒
		};
		if (/(y+)/.test(fmt))
			fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
		for (var k in o)
			if (new RegExp("(" + k + ")").test(fmt))
				fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
		return fmt;
	}
	
	function reload() {
		dataTable.dataTable().api().draw();
	}

</script>